<template>
<div>
  <el-breadcrumb separator="/">
    <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
    <el-breadcrumb-item><a>数据统计</a></el-breadcrumb-item>
    <el-breadcrumb-item>当月工资</el-breadcrumb-item>
  </el-breadcrumb>
  <el-divider></el-divider>

  <el-table :data="productArr">
    <el-table-column prop="id" label="员工编号" width="200"></el-table-column>
    <el-table-column prop="username" label="姓名"></el-table-column>
    <el-table-column prop="nickname" label="岗位"></el-table-column>
    <el-table-column prop="salary" label="工资"></el-table-column>
    <el-table-column prop="performance" label="绩效"></el-table-column>
    <el-table-column prop="saleCount" label="应发工资"></el-table-column>
  </el-table>
  <div>
    <div id="echartsdemo" ref="container"></div>
  </div>



</div>
</template>

<script>
export default {
  name: "WageStatisticsTwo",
  data() {
    return {
      productArr: [],
      options:{
        // 标题设置
        title:{text:'标图标题'},
        tooltip:{},//提示框
        legend:{// 数据标识
          data:["入住率"]
        },
        // x轴标记
        xAxis:{
          data:[],
          axisLabel:{interval: 0}
        },
        // y轴标记
        yAxis:{},
        // 数据系列
        series:[
          {
            name:'应付工资',
            type:'bar',
            data:[]
          }
        ]
      }
    }
  },
  methods: {
    loadWageStatistics() {
      let url = 'http://localhost:9085/statistics/salary';
      console.log('url = ' + url);

      this.axios
          .create({'headers': {'Authorization': localStorage.getItem('jwt')}})
          .get(url).then((response) => {
        let responseBody = response.data;
        console.log('state=' + responseBody.state);
        console.log('message=' + responseBody.message);
        this.productArr = responseBody.data;
      });
    }
  },
  mounted() {
    this.loadWageStatistics();
  }
}
</script>

<style scoped>

</style>
